// ======================
// 响应式断点 (Breakpoints)
// 移动优先的断点设计
// ======================

$breakpoints: (
  "xs": 0,     // 超小屏（默认）
  "sm": 576px, // 手机横屏
  "md": 768px, // 平板竖屏
  "lg": 992px, // 平板横屏/小屏PC
  "xl": 1200px, // 桌面端
  "xxl": 1600px // 大屏设计
);

// 断点别名（电商专用适配）
$mobile: map-get($breakpoints, "sm"); // 手机端上限
$tablet: map-get($breakpoints, "lg"); // 平板上限

// 媒体查询快捷混合宏
@mixin respond-to($breakpoint) {
  @if map-has-key($breakpoints, $breakpoint) {
    @media (min-width: map-get($breakpoints, $breakpoint)) {
      @content;
    }
  } @else {
    @warn "Unknown breakpoint: #{$breakpoint}";
  }
}